<%@ page pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html lang="en">
<head>
   <title>采购分析总汇</title>
</head>

<body>
   
    
</body>
<canvas id="myChart" height="10" width="40"></canvas>
<canvas id="myCharta" height="10" width="40"></canvas>

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script>
var ctx = document.getElementById('myChart').getContext('2d');

var chart= new Chart(ctx, {
    //要创建的图表类型
    type: 'line',
    //数据集
    data:{
        labels:["采购单价","采购数量","采购质量","未采购数量","0"],
        datasets:[{
            label:"供应商供货分析线形图",
           // backgroundColor:'#265a88',
            borderColor:'#265a88',
            data:[30,25,40,10,0],
        }]
    },
    // 配置项
    options: {}
});


</script>
<script>
var ctx = document.getElementById('myCharta').getContext('2d');

var chart= new Chart(ctx, {
    //要创建的图表类型
    type: 'bar',
    //数据集
    data:{
    	labels:["采购单价","采购数量","采购质量","未采购数量","0"],
        datasets:[{
            label:"采购分析总汇柱形图",
            backgroundColor:'#265a88',
            borderColor:'#265a88',
            data:[30,25,40,10,0],
        }]
    },
    // 配置项
    options: {}
});


</script>

</html>